<template>
    <div>
<el-table
    :data="tableData"
    style="width: 100%"
    >
    <el-table-column
      prop="roomnumber"
      label="房屋编号"
      width="300px">
    </el-table-column>
    <el-table-column
      prop="roomstatus"
      label="房屋状态"
      width="300px">
    </el-table-column>
    <el-table-column label="操作">
      <template slot-scope="scope">
     <el-button type="primary" @click="edit(scope.row.roomid)">编辑</el-button>
     <el-form>
       <el-dialog
  title="提示"
  :visible.sync="dialogVisible"
  width="30%"
  :before-close="handleClose"
  :append-to-body="true"
	:destroy-on-close="true"
  :close-on-click-modal="false">
   <el-radio-group v-model="roomstatusid">
    <el-radio :label="1">预售</el-radio>
    <el-radio :label="2">已售</el-radio>
    <el-radio :label="3">查封</el-radio>
      <el-radio :label="4">抵押</el-radio>
  </el-radio-group>
  <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="onsub(scope.row.roomid)">更改</el-button>
  </span>
</el-dialog>
     </el-form>
      </template>
    </el-table-column>
    
  </el-table>
    </div>
</template>
<script>
export default {
  name:"roomList",
  props:['params'],
  data () {
      return {
          tableData:[{}],
            dialogVisible: false,
              roomstatusid: "",
              roomid:""
        
      }
  },
  mounted () {
      this.showRoom();
  },
  methods:{
      showRoom(){
          var the= this;
          
          this.sa.ajax("/room/listAllRoom",{
              "buildingid":this.params.buildingid
          },
          function(data){
             the.tableData=data.data;
          }.bind(this))
      },
      edit(roomid){
          var the = this;
          the.dialogVisible = true
          this.roomDetail(roomid);
      },
      roomDetail(roomid){
          var the = this;
          this.sa.ajax("/room/findRoomByid",{
              "roomid":roomid
          },
          function(data){
             the.roomstatusid= data.data.roomstatusid;
             the.roomid=data.data.roomid
             
          }.bind(this)
       
          )
      },
      onsub(){
        var the = this;
        this.sa.ajax("/room/changeState",{
            "roomid":the.roomid,
            "roomstatusid":this.roomstatusid
        },
        function(data){
            if(data.data!=0){
                this.showRoom();
                 this.dialogVisible = false;
            }
        }.bind(this)
        )

      },
      handleClose(){
          this.dialogVisible = true
      }
    }

  }

</script>